<template>
  <div>
    <div class="Intelligence">
      <div class="Intelligence_top">
        <div class="Intelligence_header_left">
          <h3>我的高考成绩</h3>
          <div class="my_achievement">
            <span>
<<<<<<< HEAD
              {{UserLsit.provinceName}}省/{{UserLsit.estimateScore +"分"}}/
              {{UserLsit.gradeName}}
            </span>
=======
              {{MyNews.provinceName}}省/{{MyNews.estimateScor}}/
              {{MyNews.grade == '0' ? "理科" : MyNews.grade == '1' ? "文科" : MyNews.grade == '2' ? "新高考" : "null" }}
            </span>
            <i class="el-icon-edit-outline"></i>
>>>>>>> 314b442cce11d658746227581b0160373004c345
          </div>
        </div>
      </div>
      <div class="Preference_set">
        <h3>偏好设置</h3>
        <div class="Preference_set_bottom">
          <h3>
            学校地区
            <span>可多选</span>
            <i class="el-icon-finished"></i>
          </h3>
          <el-dropdown split-button type="primary" @command="handleProvince">
            <div class="Preference_none">
              <div class="Preference_set_span" v-if="dynamicTags.length == 0 ">不限</div>
              <el-tag
                :key="tag.id"
                v-else
                v-for=" tag  in dynamicTags"
                closable
                :disable-transitions="false"
                @close="handleClose(tag)"
              >{{ tag.title }}</el-tag>
            </div>
            <div class="dropdown-menu">
              <el-dropdown-menu slot="dropdown">
<<<<<<< HEAD
                <el-dropdown-item v-for="(item , index) in provinces" :key="index" :command="item">
                  {{ item.title }}
                  <i
                    class="el-icon-circle-check"
                    v-if="dynamicTags.map(D => D.id).indexOf(item.id) != -1"
                  ></i>
                </el-dropdown-item>
=======
                <el-dropdown-item
                  v-for="(item , index) in provinces"
                  :key="index"
                  :command="item "
                >{{item.title}}</el-dropdown-item>
>>>>>>> 314b442cce11d658746227581b0160373004c345
              </el-dropdown-menu>
            </div>
          </el-dropdown>
        </div>
        <div class="Preference_sets_bottom">
          <div class="Preference_set_bottom">
            <h3>
              批次
              <span>单项选择</span>
              <i class="el-icon-finished"></i>
            </h3>
            <el-dropdown split-button type="primary" @command="handleGender">
              <div class="Preference_none">
                <div class="Preference_set_span">
<<<<<<< HEAD
                  <span>{{Gender.batchName}}</span>
=======
                  <span
                    v-for="(BatchID  ) in suitableBatch"
                    :key="BatchID.id"
                  >{{BatchID.id == Gender.id ? BatchID.batchName : '' }}</span>
>>>>>>> 314b442cce11d658746227581b0160373004c345
                </div>
              </div>

              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item
                  v-for=" (BatchID  ) in suitableBatch"
                  :key="BatchID.id"
                  :command="BatchID"
                >{{BatchID.batchName}}</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
          <div class="Preference_set_bottom">
            <h3>
              专业类别
              <span>可多选</span>
              <i class="el-icon-finished"></i>
            </h3>

            <el-dropdown split-button type="primary" @command="handleProvince">
              <div class="Preference_none">
                <div class="Preference_set_span" v-if="Major.length == 0 ">不限</div>
                <el-tag
                  :key="tag.majorAllId"
                  v-else
                  v-for=" tag  in Major"
                  closable
                  :disable-transitions="false"
<<<<<<< HEAD
                  @close="handleClose1(tag)"
=======
                  @close="handleClose(tag)"
>>>>>>> 314b442cce11d658746227581b0160373004c345
                >{{ tag.category }}</el-tag>
              </div>
              <div class="dropdown-menu">
                <el-dropdown-menu slot="dropdown">
                  <el-tree
                    :data="catalogue"
<<<<<<< HEAD
=======
                    show-checkbox
>>>>>>> 314b442cce11d658746227581b0160373004c345
                    node-key="majorAllId"
                    ref="tree"
                    highlight-current
                    :props="defaultProps"
<<<<<<< HEAD
                    @node-click="handleNodeClick"
=======
>>>>>>> 314b442cce11d658746227581b0160373004c345
                  ></el-tree>
                </el-dropdown-menu>
              </div>
            </el-dropdown>
<<<<<<< HEAD

            <p v-show="Major.length > 0 " class="Preference_set_bottom_p">
              <i class="el-icon-info"></i> 未满足检索条件时,将自动扩大范围检索。
            </p>
=======
            <div class="addbutton" @click="getCheckedKeys()">
              <el-button type="primary" @click="getCheckedNodes()">添加专业类别</el-button>
            </div>
>>>>>>> 314b442cce11d658746227581b0160373004c345
          </div>
        </div>
      </div>
      <div class="Preference_set_button">
        <!-- <router-link to="IntelligenceList">
        <el-button type="primary" @click="getRecommend()">
          <i class="iconfont">&#xe655;</i>&nbsp;&nbsp;一键智能填报
        </el-button>
        </router-link>-->

        <el-button type="primary" @click="getRecommend()">
          <i class="iconfont">&#xe655;</i>&nbsp;&nbsp;一键智能填报
        </el-button>
      </div>
    </div>
    <transition name="fade">
      <div class="Lists_major" v-if="intelligentFirst.length > 0 ">
        <div class="IntelligenceLists">
          <div
            class="Intelligence_Lists"
            v-for="(item , index) in intelligentFirst "
            :key="item.schoolId"
          >
            <div class="header_lsit">
              <div class="shcool_logo">
                <div class="shcool_img">
                  <img :src="item.logoUrl" alt />
                </div>
                <div class="shcool_name">
                  <h3>{{item.yuanxiaomingcheng}}</h3>
<<<<<<< HEAD
                  <p>{{item.uniCity}}</p>
                  <br />
=======
>>>>>>> 314b442cce11d658746227581b0160373004c345
                  <p>
                    录取概率:
                    <span>{{item.admissionOdds}}</span>
                    <i>%</i>
                  </p>
                </div>
              </div>
              <div class="planNum">
                <!-- <p>
              2019年计划:
              <span>{{item.planNum}}人</span>
                </p>-->
                <h4>
                  <span>2019最低分数:</span>
                  {{item.minScore}}分
                </h4>
                <h4>
                  <span>2019最低位次:</span>
                  {{item.minRanking}}位
                </h4>
              </div>
              <div class="lists_name">
                <el-button type="primary" circle>{{String.fromCharCode(64 + parseInt(index+1))}}</el-button>
              </div>
            </div>

            <div class="Lists_Major" v-for="(lists  )  in  item.majorList" :key="lists.id">
              <div class="major_name_header">
                <h4>{{lists.majIntroduce }}</h4>
              </div>
              <div class="major_name_bottom">
                <ul>
                  <li>
                    计划数:
                    <span>{{lists.planNum}}</span>
                  </li>
                  <li>
                    学制:
                    <span>{{lists.schoolYear}}</span>
                  </li>
                  <li>
                    学费:
                    <span>{{lists.cost}}</span>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <div class="lists_bottom_button">
          <el-button type="primary" @click="addVolunteer">保存到我的志愿表</el-button>
        </div>
      </div>
    </transition>
  </div>
</template>

<script>
<<<<<<< HEAD
export default {
  name: "Intelligence",

  data() {
    return {
      fullscreenLoading: false,
      Gender: "",
=======
import IntelligenceList from "./IntelligencedList";
import { log } from "util";
import { lstat } from "fs";
export default {
  name: "Intelligence",
  components: {
    IntelligenceList
  },
  data() {
    return {
      fullscreenLoading: false,
      Gender: {
        id: 0,
        batchType: 2
      },
>>>>>>> 314b442cce11d658746227581b0160373004c345
      dynamicTags: [],
      provinces: [],
      CheckedNodes: [],
      Major: [],
      MajorID: [],
      BatchID: "",
      intelligentFirst: [],
      teslist: [],
      Specialty: "",
      suitableBatch: "",
<<<<<<< HEAD
      UserLsit: "",
      UMajorList: "",
      SMajorList: "",
=======
      MyNews: {
        examinationYear: localStorage.getItem("examinationYear"),
        estimateRanking: localStorage.getItem("estimateRanking"),
        estimateScor: localStorage.getItem("estimateScore"),
        grade: localStorage.getItem("grade"),
        provinceName: localStorage.getItem("provinceName"),
        examinationProvince: localStorage.getItem("examinationProvince")
      },
>>>>>>> 314b442cce11d658746227581b0160373004c345
      catalogue: [],
      defaultProps: {
        children: "majorAllEntityList",
        label: "category"
      }
    };
  },
  methods: {
<<<<<<< HEAD
    //提示失败
    open3(s) {
      this.$message.error(s);
    },
    //提示成功
=======
    open3(s) {
      this.$message.error(s);
    },
>>>>>>> 314b442cce11d658746227581b0160373004c345
    open1(g) {
      this.$message({
        message: g,
        type: "success"
      });
    },
<<<<<<< HEAD
    //loading
=======

>>>>>>> 314b442cce11d658746227581b0160373004c345
    openFullScreen(t, s) {
      const loading = this.$loading({
        lock: true,
        text: t,
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
        customClass: "loadingSize"
      });
      setTimeout(() => {
        loading.close();
      }, s);
    },
<<<<<<< HEAD
    getUserLsit() {
      this.$ajax({
        method: "POST",
        url: "/api/query/userInfo",

        success: res => {
          if (res.data.code == 0) {
            this.UserLsit = res.data.data;
          }
        }
      });
    },
=======
>>>>>>> 314b442cce11d658746227581b0160373004c345

    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
<<<<<<< HEAD
    handleClose1(tag) {
      this.Major.splice(this.Major.indexOf(tag), 1);
    },
    handleGender(GenderS) {
      this.Gender = GenderS;
      if (GenderS.batchType == 1) {
        this.catalogue = this.SMajorList;
      } else {
        this.catalogue = this.UMajorList;
      }
    },
    // 添加专业
    handleNodeClick(M) {
      if (M.type > 2) {
        if (this.Major.map(M => M.majorAllId).indexOf(M.majorAllId) == -1) {
          this.Major.push(M);
        } else {
          this.open3("此专业" + "“" + M.category + "”" + "已选择");
        }
      }
    },
    // showInput() {
    //   this.inputVisible = true;
    //   this.$nextTick(_ => {
    //     this.$refs.saveTagInput.$refs.input.focus();
    //   });
    // },
=======
    handleGender(Gender) {
      this.Gender = Gender;
    },

    showInput() {
      this.inputVisible = true;
      this.$nextTick(_ => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
>>>>>>> 314b442cce11d658746227581b0160373004c345

    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
<<<<<<< HEAD
    //添加省份
    handleProvince(tag) {
      if (this.dynamicTags.map(D => D.id).indexOf(tag.id) == -1) {
        this.dynamicTags.push(tag);
      } else {
        this.open3(tag.title + "省已选择 ，选择其它省份");
      }
=======
    handleProvince(tag) {
      //   this.dynamicTags.splice(this.dynamicTags.indexOf(command), 1);
      this.dynamicTags.push(tag);
>>>>>>> 314b442cce11d658746227581b0160373004c345
    },
    getProvinces() {
      this.$ajax({
        method: "GET",
        url: "/api/province/queryAll",

        success: res => {
          if (res.data.code == 0) {
            this.provinces = res.data.data;
          } else {
            this.open3(res.data.msg);
          }
        }
      });
    },
    getMajor() {
      this.$ajax({
<<<<<<< HEAD
=======
        method: "GET",
        url: "/api/major/guess/catalogue/" + this.Gender.batchType,

        success: res => {
          if (res.data.code == 0) {
            this.catalogue = res.data.data;
          } else {
            this.open3(res.data.msg);
          }
        }
      });
      this.$ajax({
>>>>>>> 314b442cce11d658746227581b0160373004c345
        method: "POST",
        url: "/api/voluntary/targetBatch",

        success: res => {
          if (res.data.code == 0) {
<<<<<<< HEAD
            this.Gender = res.data.data.suitableBatch[0];

            this.suitableBatch = res.data.data.suitableBatch;

=======
            this.suitableBatch = res.data.data.suitableBatch;
>>>>>>> 314b442cce11d658746227581b0160373004c345
            var str = res.data.data.suitableBatch;
            var j = [];
            str.forEach(e => {
              j.push(e.id);
              return j;
            });

            var Undergraduate = j[0];
            var Specialty = j[1];
            localStorage.setItem("Undergraduate", Undergraduate);
            localStorage.setItem("Specialty", Specialty);
          }
        }
      });
    },
<<<<<<< HEAD
    //获取专业树
    getMajorList() {
      this.$ajax({
        method: "GET",
        url: "/api/major/guess/catalogue/" + 2,

        success: res => {
          if (res.data.code == 0) {
            this.UMajorList = res.data.data;
            this.catalogue = res.data.data;
          } else {
            this.open3(res.data.msg);
          }
        }
      });
      this.$ajax({
        method: "GET",
        url: "/api/major/guess/catalogue/" + 1,

        success: res => {
          if (res.data.code == 0) {
            this.SMajorList = res.data.data;
          } else {
            this.open3(res.data.msg);
          }
        }
      });
    },

=======
>>>>>>> 314b442cce11d658746227581b0160373004c345
    getCheckedKeys() {
      console.log(this.$refs.tree.getCheckedKeys());
      this.MajorID = this.$refs.tree.getCheckedKeys();
    },
    getCheckedNodes() {
      console.log(this.$refs.tree.getCheckedNodes());

      this.Major = this.$refs.tree.getCheckedNodes();
    },
    //生成学校与专业
    getRecommend() {
<<<<<<< HEAD
      let userInfo = JSON.parse(localStorage.getItem("userInfo"));
      var vip = userInfo.userEntity.vip;

      if (vip > 1) {
        this.openFullScreen("正在计算数据", 2000);
        var ProvincesID = [];
        this.dynamicTags.map(tiem => {
          return ProvincesID.push(tiem.id);
        });

        var ProvincesIDs = ProvincesID.filter((element, index, self) => {
          return self.indexOf(element) === index;
        });

        var MajorID = [];
        this.Major.map(ID => {
          return MajorID.push(ID.majorAllId);
        });
        if (this.code === this.input_code) {
          this.$ajax({
            method: "POST",
            url: "/api/voluntary/intelligentFirst",
            data: {
              batch: this.Gender.id,
              targetMajorList: MajorID,
              targetProvincesList: ProvincesIDs
            },
            success: res => {
              if (res.data.code == 0) {
                this.intelligentFirst = res.data.data.list;
              } else {
                this.open3(res.data.msg);
              }
            }
          });
          //  this.$ajax({
          //   method: "get",
          //   url: "/api/voluntary/targetBatch",

          //   success: res => {}
          // });
        }
      } else {
        this.$router.push({
          path: "/MyMember/Member/3"
        });
=======
      this.openFullScreen("正在计算数据", 2000);
      var ProvincesID = [];
      this.dynamicTags.map(tiem => {
        return ProvincesID.push(tiem.id);
      });

      var ProvincesIDs = ProvincesID.filter((element, index, self) => {
        return self.indexOf(element) === index;
      });

      if (this.code === this.input_code) {
        this.$ajax({
          method: "POST",
          url: "/api/voluntary/intelligentFirst",
          data: {
            batch: this.Gender.id,
            targetMajorList: this.MajorID,
            targetProvincesList: ProvincesIDs
          },
          success: res => {
            if (res.data.code == 0) {
              this.intelligentFirst = res.data.data.list;
            } else {
              this.open3(res.data.msg);
            }
          }
        });
        //  this.$ajax({
        //   method: "get",
        //   url: "/api/voluntary/targetBatch",

        //   success: res => {}
        // });
>>>>>>> 314b442cce11d658746227581b0160373004c345
      }
    },
    //保存志愿表
    addVolunteer() {
      this.openFullScreen("正在保存志愿", 4000);
      var date = new Date();

      var year = date.getFullYear();
      var month = date.getMonth();
      var day = date.getDate();

      var hour = date.getHours();
      var minute = date.getMinutes();
      var second = date.getSeconds();

      //这样写显示时间在1~9会挤占空间；所以要在1~9的数字前补零;
      if (hour < 10) {
        hour = "0" + hour;
      }
      if (minute < 10) {
        minute = "0" + minute;
      }
      if (second < 10) {
        second = "0" + second;
      }

      var x = date.getDay(); //获取星期

      var newtime =
        minute +
        second +
        minute +
        "_" +
        year.toString() +
        month.toString() +
        day.toString() +
        hour.toString() +
        minute.toString() +
        second.toString();

      var str = [];

      var lists = this.intelligentFirst.map((item, index, ary) => {
        var schoolIds = item.schoolId;
        var majorAllIds = item.majorList.map((items, indexs, arys) => {
          var ID = items.majorAllId;
          return ID;
        });
        var newMajorAllIds = majorAllIds.join();
        var NewMajorAllIds = newMajorAllIds.replace(/\[.*?\]/g, "");
        return {
          schoolId: schoolIds,
          batch: this.Gender.id,
          majorAllIds: NewMajorAllIds
        };
      });

      this.$ajax({
        method: "POST",
        url: "/api/volunteer/save/volunteer",
        data: {
          alternativeType: 4,
          volunteerId: 0,
          volunteerName: newtime,
          volunteerSchoolEntities: lists
        },
        success: res => {
          if (res.data.code == 0) {
            this.intelligentFirst = [];
            this.open1(res.data.msg);
          } else {
            this.open3(res.data.msg);
          }
        }
      });
    }
  },

  beforeCreate() {
    this.$nextTick(() => {
      this.getProvinces();
<<<<<<< HEAD
      this.getUserLsit();
      this.getMajor();
      this.getMajorList();
=======
      this.getMajor();
>>>>>>> 314b442cce11d658746227581b0160373004c345
    });
  }
};
</script>
<style lang="scss" >
.el-loading-spinner {
  font-size: 20px;
  .el-loading-text {
    color: #409eff;
    margin: 10px 0;
    font-size: 20px;
  }

  .el-icon-loading {
    font-size: 40px;
  }
}

.el-dropdown-menu {
  position: absolute;
  height: 300px;
  overflow-y: auto;
  padding-right: 20px;
  background-color: #ffffff;
  border: 1px solid #ebeef5;
  border-radius: 4px;
  -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
<<<<<<< HEAD
  .addbutton {
    margin-top: 20px;
    margin: 10px auto;
    padding-left: 20px;
  }
  .dropdown {
    margin: 10px auto;
  }
=======
>>>>>>> 314b442cce11d658746227581b0160373004c345
}
.el-dropdown-menu::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #d0cece;
}
.el-dropdown-menu::-webkit-scrollbar {
  width: 6px;
  height: 16px;
}
.el-dropdown-menu::-webkit-scrollbar-track {
  padding: 0 4px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
  background-color: #f5f5f5;
}
<<<<<<< HEAD
.el-icon-circle-check {
  color: #67c23a;
}
=======

>>>>>>> 314b442cce11d658746227581b0160373004c345
.Intelligence {
  width: 1000px;
  height: 682px;
  padding: 100px;
  background: #fff;
  border-radius: 3px;

  .Intelligence_header_left {
    width: 260px;
    > h3 {
      padding-bottom: 22px;
    }
    .my_achievement {
      display: flex;
      background: #f8f8f8;
      border-color: #f8f8f8;
      border-radius: 4px;
      color: #818181;
      > span {
        display: block;
        line-height: 36px;
        padding-left: 18px;
        width: 200px;
      }
      > i {
        padding: 14px;
        font-size: 12px;
      }
    }
  }
  .Preference_set {
    margin-top: 70px;
    > h3 {
      color: #9a9a9a;
    }
    .Preference_sets_bottom {
      display: flex;
      justify-content: space-between;
    }
    .Preference_set_bottom {
      margin-top: 38px;

      > h3 {
        padding-bottom: 20px;
        span {
          color: #cfcfcf;
          font-size: 10px;
          padding-right: 4px;
        }
        i {
          color: #f19148;
          font-size: 12px;
        }
      }
      .Preference_none {
        width: 224px;
        overflow: hidden;
      }
      .el-button--primary {
        color: #cccccc;
        background-color: #f7f7f7;
        border-color: #f7f7f7;
      }
      .Preference_set_span {
        padding: 9px;
      }
      .el-icon-arrow-down {
        font-size: 16px;
      }
      .el-dropdown .el-dropdown__caret-button {
        padding: 20px 10px;
        position: relative;

        top: 1px;
      }

      .el-dropdown {
        vertical-align: top;
      }
      .el-dropdown + .el-dropdown {
        margin-left: 15px;
      }
      .el-icon-arrow-down {
        font-size: 16px;
      }

      .el-tag + .el-tag {
        margin-left: 10px;
      }
      .button-new-tag {
        margin-left: 10px;
        height: 32px;
        line-height: 30px;
        padding-top: 0;
        padding-bottom: 0;
      }
      .input-new-tag {
        width: 90px;
        margin-left: 10px;
        vertical-align: bottom;
      }
<<<<<<< HEAD
      .Preference_set_bottom_p {
        padding: 20px 0;
        color: #cfcfcf;
        font-size: 14px;
        cursor: pointer;
      }
      .Preference_set_bottom_p:hover {
        color: #f56c6c;
=======
      .addbutton {
        margin-top: 20px;
        .el-button--primary {
          background: #66b1ff;
          color: #fff;
        }
>>>>>>> 314b442cce11d658746227581b0160373004c345
      }
    }

    .el-dropdown .el-dropdown__caret-button::before {
      background: rgba(70, 220, 233, 0.5);
    }
    .el-dropdown .el-dropdown__caret-button:hover {
      border-left-color: rgba(70, 220, 233, 0.5);
      height: 100%;
    }
  }
  .Preference_set_button {
    margin-top: 126px;
    .el-button {
      padding: 12px 40px;
      .iconfont {
        color: #f19148;
        font-size: 18px;
      }
    }
  }
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.Lists_major {
  margin-top: 20px;

  background: #fff;
  border-radius: 3px;
  .IntelligenceLists {
    width: 1100px;
    padding: 50px;

    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    .Intelligence_Lists {
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);

      width: 522px;
      border-radius: 6px;
      margin-bottom: 30px;

      padding: 10px;
<<<<<<< HEAD
      height: 778px;
=======
      height: 738px;
>>>>>>> 314b442cce11d658746227581b0160373004c345
      .header_lsit {
        padding: 20px 0;
        display: flex;
        justify-content: space-between;
        border-bottom: 4px dotted#E4E7ED;
        margin-bottom: 20px;
        .shcool_logo {
          display: flex;

          img {
            width: 50px;
            height: 50px;
          }
          .shcool_name {
            margin-left: 10px;
            h3 {
              line-height: 20px;
              font-size: 18px;
              color: #1b1b1b;
              padding-bottom: 10px;
            }
            p {
              color: #aaaaaa;
              font-size: 14px;
              span {
                font-size: 18px;
                color: #e84c33;
              }
              i {
                font-size: 14px;
                color: #1b1b1b;
              }
            }
          }
        }
        .planNum {
          color: #aaa;
          font-size: 14px;
          > p {
            padding-bottom: 4px;
            > span {
              color: #535353;
              font-size: 12px;
            }
          }
          > h4 {
            line-height: 20px;
            font-size: 14px;
            span {
              padding-right: 6px;
            }
          }
        }
        .lists_name {
          position: relative;
          top: -20px;
        }
      }
      .Lists_Major {
        border-radius: 4px;
        height: 82px;
        border: 2px dotted#E4E7ED;
        margin-bottom: 20px;
        .major_name_header {
<<<<<<< HEAD
          position: relative;
=======
>>>>>>> 314b442cce11d658746227581b0160373004c345
          padding: 10px;
          h4 {
            font-size: 14px;
            color: #000;
            line-height: 20px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2; //规定几行显示省略号
            -webkit-box-orient: vertical;
          }
<<<<<<< HEAD
          h4:hover {
            overflow: visible;
            background: rgba($color: #ffffff, $alpha: 1);
            position: absolute;
            z-index: 10;
            display: block;
            padding-bottom: 20px;
            padding: 20px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12),
              0 0 6px rgba(0, 0, 0, 0.04);
          }
=======
>>>>>>> 314b442cce11d658746227581b0160373004c345
        }
        .major_name_bottom {
          font-size: 12px;
          color: #707070;
          padding: 0 10px;
          ul {
            display: flex;
            li {
              margin-right: 20px;
              span {
                color: #000;
              }
            }
          }
        }
      }
    }
  }
  .lists_bottom_button {
    width: 170px;

    margin: 0 auto;
    padding: 30px 0;
    padding-bottom: 56px;
    .el-button {
      margin: 0 auto;
    }
  }
}
</style>